<template>
	<div class="box">
		<!-- <div ref="myEcharts" class="chartsBox"></div> -->
		<ReportCharts ref="chartRef" @getUrl="handleCustomEvent" :getData="all"/>
	</div>
</template>

<script>
	import ReportCharts from '../../management/components/ReportCharts.vue'

	export default {
		props: {
			allData:{
				type:Object,
			},
		},
		components: {
			ReportCharts
		},
		data() {
			return {
				all:{
					networkList:[],
					cpuList:[],
					memoryList:[],
					timeList:[],
					imgList:[],
					ioList:[],
					ioReadList:[],
					ioWriteList:[],
					allIoList:[],
					ip:'',
					alertList:[],
				},
				
			};
		},
		created() {
			this.getData()
		},
		mounted() {
			
		},
		methods: {
			getData(){
				// console.log('中间',this.allData)
				this.ip = this.allData.ip
				let cpu = this.allData.cpu
				let memory = this.allData.memory
				let network = this.allData.network
				let io = this.allData.io
				this.all.alertList = this.allData.alert
				this.all.allIoList = this.allData.io
				cpu.forEach((item,index)=>{
					this.all.cpuList.push(item.cpuIdle)
					this.all.timeList.push(item.recordTime)
				})
				memory.forEach((item,index)=>{
					this.all.memoryList.push(item.usedPer)
				})
				network.forEach((item,index)=>{
					this.all.networkList.push(item.rxKbyteSpeed + item.txKbyteSpeed)
				})
				io.forEach((item,index)=>{
					// console.log('jjb',item.ioIdle)
					this.all.ioList.push(item.ioIdle)
					this.all.ioReadList.push(item.read)
					this.all.ioWriteList.push(item.write)
				})
			},
			handleCustomEvent(value){
				// value.ip = this.ip
				value.push({
					ip:this.ip
				})
				this.$emit('imgList',value)
			},
		},
	};
</script>

<style lang="scss" scoped>
	.box{
		box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
		border-radius: 3px;
	}
</style>
